<!-- 页尾组件 -->
<script setup lang="ts">

</script>
<template>
    <div class="footer__wrap fv">
        <div class="fh r1">
            <div class="r1c1 fv">
                <div class="logo">
                    <div class="logo__wrap">
                        <img src="#" alt="" style="margin: 10px;width: 50px;height: 50px;" />
                        <div class="fv">
                            <div class="bold1 fontsize1">
                                互联网协会
                            </div>
                            <div style="font-size: 13px;" class="bold1">
                                CAUIS
                            </div>
                        </div>

                    </div>
                </div>

            </div>

            <div class="r1c3">
                <div class="bold1 fontsize1" style="margin-bottom: 30px;">
                    联系方式
                </div>
                <div class="fontsizes2 mv10">
                    官方邮箱：support@opende.org.cn
                </div>
                <div class="fh r1c3r fontsizes3">
                    <div class="r1c3rc fv">
                        <img src="#" alt=""/>
                        <div>微信公众号</div>
                    </div>
                    <div class="r1c3rc fv">
                        <img src="#" alt=""/>
                        <div>QQ</div>
                    </div>

                </div>
            </div>
        </div>
        <div class="fh">
<div style="flex-basis: 100%;max-width:800px;border-bottom: white 2px solid;"></div>
</div>
        <div class="r2 fh">
            <div>
                <!-- ©2022 OpenDE 京ICP备16046123号-7 京公网安备 11010111119111号 -->
            </div>
        </div>
    </div>
</template>

<style scoped>
.footer__wrap {
    padding: 0 20px;
    padding-top: 100px;
    padding-bottom: 30px;
    min-height: 350px;
    background: rgb(47, 50, 52);
    color: white;
}

.logo {
    width: 200px;
    display: flex;
    align-items: center;
}

.logo__wrap {
    display: flex;
    flex-direction: row;
    margin: 0 auto;
}
@media (max-width:800px ){
.r1c1{
display: none;
}
    
}
.r1{
align-self: center;
/* min-width: 800px; */
justify-content: space-between;
margin-bottom: 40px;
flex-wrap: wrap;
}
.r1c1{
justify-content:center;

margin: 0 70px;

}
.r1c2{
flex-basis: 200px;
min-width: 200px;
}
.r2 {
    margin-top: 25px;
}
.r1c3r{
justify-content: flex-start;
}
.r1c3rc div{
text-align: center;
}
.r1c3rc>img{
margin: 7px;width: 90px;height: 90px;
}
</style>
